<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<head>
</head>
<script type="text/javascript" src="./jquery.js"></script>
<script type="text/javascript">
	//json检验地址:https://www.bejson.com/
	//json数据结构
	var stu = 
	{
		"name":"张三",
		"age":18,
		"list":[1,3],
		"flag":true,
		"obj":{
			"test":"123"
		},
	};

	
	//console.log(stu.obj.test);
	
	
	//json增删改查
	//省市级连
	var pros = {};
	//增加
	var citys = ["武汉市","黄冈市","宜昌市","咸宁市","孝感市"];
	pros["湖北省"] = citys;
	citys = ["静安区","虹口区","徐汇区","浦东区","宝山区"];
	pros["上海市"] = citys;
	citys = ["深圳市","广州市","东莞市"];
	pros["广东省"] = citys;
	citys = ["XX市","XX市","XX市"];
	pros["广西省"] = citys;
	//pros.name = "zhang";
	//pros["name"] = "123";
	//console.log(pros);
	//alert(pros);
	//删除
	//delete pros["广西省"][0];
	//console.log(pros);
	//修改
	pros["湖北省"][0] = "仙桃市";
	console.log(pros);
	
	function change(){
		var p = $("#pp").val();
		if(pros[p] != null && pros[p] != undefined){
			var citys = pros[p];
			var cc_html = '<option value="全部">--全部--</option>';
			for(var index in citys){
				cc_html+= '<option value="'+citys[index]+'">'+citys[index]+'</option>';
			}
			$("#cc").html(cc_html)
		}
	}
</script>
<body>
	<div style="margin-left:100px;margin-top:100px;">
		省份：<select id="pp" ></select> 市级：<select id="cc"></select>
	</div>
	<script>
		var pp_html = '<option value="全部">--全部--</option>';
		for(var p in pros){
			pp_html+= '<option value="'+p+'">'+p+'</option>';
		}
		$("#pp").html(pp_html)
		var cc_html = '<option value="全部">--全部--</option>';
		$("#cc").html(cc_html)
		
		$("#pp").on("change",function(){
			change();
		});
	</script>
</body>
</html>